<template>
	<div class="textArea01">
		<label v-if="title!==''" class="textArea01-label">{{title}}:</label>
		<el-input class="textarea-input" type="textarea" :placeholder="(val==''||val==null)&&disabled==true?'无':placeholder"
			:disabled="disabled" v-model="val">
		</el-input>
	</div>
</template>
<style scoped>
	.textArea01 {
		margin: 5px 5px;
		display: flex;
		justify-content: flex-start;
		width: 100%;
	}

	.textArea01-label {
		min-width: 35px;
	}

	.textarea-input>>>textarea {
		width: 100%;
		height: 100% !important;
		font-family: Source Han Sans CN;
	}
</style>
<script>
	export default {
		name: "textArea01",
		props: {
			title: {
				default: ""
			},
			value: {
				default: ''
			},
			disabled: {
				default: false
			},
			placeholder: {
				default: "请输入内容"
			},
		},
		data() {
			return {
				val: ''
			};
		},
		mounted() {
			this.val = this.value;
			// console.log(this.val)
			// console.log((this.val==''||this.val==null)&&this.disabled==true?'无':this.placeholder)
		},
		watch: {
			val(value) {
				this.$emit('input', value);
			},
			value() {
				this.val = this.value;
			}
		}
	};
</script>